<?php
/*
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */
?>
<!-- 主体内容 -->
<div id="excel-wrapper" class="container">
    <div class="row">
        <!--   <div class="col-md-12">-->
        <div class="col-md-12">
            <!--            <div class="panel panel-default">-->
            <div class="panel panel-primary">
                <!-- Default panel contents -->
                <div class="panel-heading">排期详情</div>
                <!--            <div class="panel-body">
                                <p>...</p>
                            </div>-->
            </div>  </div>
       
            <div style="height:500px;width:  1150px;overflow:scroll;padding-left:15px ">
                <!-- Table  斑马线 table-striped 边框table-bordered-->
                 <table id="tst-table" class="table table-hover table-bordered" style="width:2150px;">
                    <th>排期</th>
                    <th>项目</th>
                    <th>模块</th>
                    <th>功能</th>
                    <th>负责人</th>
                    <th>添加人</th>
                    <th>添加时间</th>
                    <th>详情</th>
                    <th>修改</th>

                </table>
                <table id="schedule-table" class="table table-hover table-bordered" style="width:2150px;">
                    <th>排期</th>
                    <th>项目</th>
                    <th>模块</th>
                    <th>功能</th>
                    <th>负责人</th>
                    <th>添加人</th>
                    <th>添加时间</th>
                    <th>详情</th>
                    <th>修改</th>

                </table>
            </div>

            <!--            <div class="panel panel-default">
                        <div id="pagination" style="text-align:center">
                                pagination container 
                                
                                                <ul class="pager">
                                <ul class="pagination ">
                                    <li ><a href="#" class="previous">上一页</a></li>
                                       <li class="previous"><a href="#">&larr; Older</a></li>
                                       
                                      <li class="next"><a href="#">Newer &rarr;</a></li>
            
            <li><span>&laquo;</span></li>
                                    <li><a href="#">1</a></li>
                                    <li><a href="#">2</a></li>
                                    <li><a href="#">3</a></li>
                                    <li><a href="#">4</a></li>
                                    <li><a href="#">5</a></li>
                                      <li><a href="#">&raquo;</a></li>
            
            
                                    <li><a href="#" class="next">下一页</a></li>
                                </ul>
                            </div>-->
            <!--     
                      <button id="btn-save" class="btn btn-danger" data-toggle="modal" data-target="#save-confirm">保存</button>
                         <button id="dump">dump console</button>-->
      

    </div>
    <!--弹出框-->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                    <h4 class="modal-title" id="myModalLabel">排期详情</h4>
                </div>
                <div class="modal-body">
                    <div id="modal-body-context"></div>

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <!--        <button type="button" class="btn btn-primary">Save changes</button>-->
                </div>
            </div>
        </div>
    </div>



    <script type="text/javascript" charset="utf-8">


        function getscheduledetails() {
            //baseurl=$("#baseUrl").html();
            // alert(baseurl);
            $.ajax({
                type: "post",
                url: "/testdrive/index.php/schedule/getAllScheduleDetials",
                data: "",
                success: function(result) {
                    data = eval(result);// 错误点，要人为转化为json。  特别留心：如果obj本来就是一个JSON对象，那么运用 eval（）函数转换后（哪怕是多次转换）还是JSON对象，但是运用 parseJSON（）函数处理后会有疑问（抛出语法异常）。
                    // alert(JSON.stringify(data));
                    //    alert("kl" + "12345");
                    if (data != null) {
                        for (var o in data) {
                            //错误点：字符串拼接有误
                            //     alert("text:" + data[o].project + " value:" + data[o].detail);
                            //                          var html = "<tr>"
                            //                                + "<td>" + data[o].dateline + "</td>"
                            //                                + "<td>" + data[o].project + "</td>"
                            //                                + "<td>" + data[o].module + "</td>"
                            //                                + "<td>" + data[o].fun + "</td>"
                            //                                + "<td>" + data[o].people + "</td>"
                            //                                + "<td>" + data[o].adder + "</td>"
                            //                                + "<td>" + data[o].addtime + "</td>"
                            //                                + "<td>" + "<button id='"data[o].sid+"' value='详情' onclick=""></button>" + "</td>"
                            //                                + "</tr>"; 
                            // table = "<tr>"+ "<td>" + "data[o].dateline" + "</td>"+ "<td>" +" data[o].project" + "</td>"+ "<td>" + "data[o].module "+ "</td>"+ "<td>" + "data[o].fun "+ "</td>" + "<td>" + "data[o].people" + "</td>"+ "<td>" + "data[o].adder" + "</td>"+ "<td>" + "data[o].addtime" + "</td>"+ "<td>" + "<button id='"+"data[o].sid"+"'  value='详情' onclick=""></button>" + "</td>"+ "</tr>";
                            //   var html = "";
                            //     html = "<tr>".append("<td>").append(data[o].dateline).append("</td>").append("<td>").append(data[o].project).append("</td>").append("<td>").append(data[o].module).append("</td>").append("<td>").append(data[o].fun).append("</td>").append("<td>").append(data[o].people).append("</td>").append("<td>").append(data[o].adder).append("</td>").append("<td>").append(data[o].addtime).append("</td>").append("<td>").append("data[o].addtime").append("</td>").append("</tr>");
                            //       "<td>" + "<button id='"data[o].sid+"' value='详情' onclick=""></button>" + "</td>"
                            //     + "<td>" + "<button id='"data[o].sid+"' value='详情' onclick=""></button>" + "</td>"
                            //                   detailbutton = "<button id=" + data[o].sid + "onclick=" + "\"detailButton(this.id)\"" + ">详情</button>";//添加按钮
                            detailbutton = "<input type=" + "\"button\"" + " onclick=" + "\"detailButton('" + data[o].sid + "','" + data[o].detail + "')\"" + " value=" + "详情" + ">";//添加按钮
                            //拼接字符串注意空格，直接空格就行 " class=\"btn btn-default\""+
                            //detailbutton = "<button type=\"button\" class=\" btn-default\" data-toggle=\"popover\" data-placement=\"top\" title=\"A Title\" data-content=\"And heres some amazing content. Its very engaging. right?\" role=\"button\" >详情</button>"
                            //   detailbutton = "<button id=" + data[o].sid + " onclick=" + "\"test\"" + ">详情</button>";
                            //   schtable = "<tr>" + "<td>" + data[o].dateline + "</td>" + "<td>" + data[o].project+ "</td>" + "<td>" + data[o].module + "</td>" + "<td>" + data[o].func + "</td>" + "<td>" + data[o].people+ "</td>" + "<td>" + data[o].adder+ "</td>" + "<td>" + data[o].addtime + "</td>" + "<td>" + "<button>详情</button>" + "</td>" + "</tr>";
                            //下面的语句有误，因为如果detail为汉字或者字母要有引号         
                            //    //modifybutton="<input type=" + "\"button\"" + "  id=" + data[o].sid + " onclick=" + "\"detailButton(this.id,"+data[o].detail+")\"" + " value=" + "修改" + ">";
                            //要用单引号引用字符串，不需要转义
                            //JSON.stringify(data[o]);

                            //modifybutton = "<input type=" + "\"button\"" + "  id=" + data[o].sid + " onclick=" + "\"modifyButton(this.id,'" + data[o].project + "','" + data[o].module + "','" + data[o].func + "','" + data[o].detail + "','" + data[o].people + "','" + data[o].dateline + "')\"" + " value=" + "修改" + ">";
                            modifybutton = "<input type=" + "\"button\"" + " onclick=" + "\"modifyButton('" + data[o].sid + "','" + data[o].project + "','" + data[o].module + "','" + data[o].func + "','" + data[o].detail + "','" + data[o].people + "','" + data[o].dateline + "')\"" + " value=" + "修改" + ">";

                            //  没有修改功能
                            //  schtable = "<tr>" + "<td>" + data[o].dateline + "</td>" + "<td>" + data[o].project + "</td>" + "<td>" + data[o].module + "</td>" + "<td>" + data[o].func + "</td>" + "<td>" + data[o].people + "</td>" + "<td>" + data[o].adder + "</td>" + "<td>" + data[o].addtime + "</td>" + "<td>" + detailbutton + "</td>" + "</tr>";
                            schtable = "<tr id=" + data[o].sid + ">" + "<td>" + data[o].dateline + "</td>" + "<td>" + data[o].project + "</td>" + "<td>" + data[o].module + "</td>" + "<td>" + data[o].func + "</td>" + "<td>" + data[o].people + "</td>" + "<td>" + data[o].adder + "</td>" + "<td>" + data[o].addtime + "</td>" + "<td>" + detailbutton + "</td>" + "<td>" + modifybutton + "</td>" + "</tr>";

                            $('#schedule-table').append(schtable);
                            //$('#schedule-table').append('"<tr>"+ "<td>" + "data[o].dateline" + "</td>"+ "<td>" +" data[o].project" + "</td>"+ "<td>" + "data[o].module "+ "</td>"+ "<td>" + "data[o].fun "+ "</td>" + "<td>" + "data[o].people" + "</td>"+ "<td>" + "data[o].adder" + "</td>"+ "<td>" + "data[o].addtime" + "</td>"+ "<td>" + "<button>详情</button>" + "</td>"+ "</tr>"');
                            //                    alert(o);//word-break: keep-all;/style=\"word-break: keep-all/\"
                            //                    alert(data[o]);
                            // alert("text:" + data[o].project + " value:" + data[o].detail);
                          //  $("#schedule-table").css("width","1000px")
                        }

                    } else {
                        alert("数据错误");
                    }
                    //    var results = JSON.parse(result);
                },
                error: function() {
                    alert("获取数据失败！再尝试一下....");
                }
            });
        }

        // 响应点击“详情”modifyButton
        function detailButton(id, details) {
            //alert("点击" + details);
            //  alert("点击" + details);
            $('#myModal').modal({
                keyboard: false
            });

            $("#modal-body-context").html(details);

        }

        //修改排期

        function modifyButton(id, project, module, func, detail, people, dtateline) {
            //      alert("点击" + JSON.stringify(eval(details)));
            //    alert("点击" + details);
            $("#main-modalLabel").html("");
            $("#main-modalLabel").append("修改排期");
            $("#main-modal-footer").html("");
            $("#main-modal-footer").append('<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>');
            //    $("#main-modal-footer").append('<button id="modify-btn-reset" class="btn btn-primary" data-toggle="modal" >重置</button>');
            $("#main-modal-footer").append('<button id="modify-btn-modifyschedule" type="button" class="btn btn-danger">修改</button>');

            $('#main-addschedule-Modal').modal({
                keyboard: false
            });
            $('#main-datetimepicker').datetimepicker({
                minView: 'month',
                autoclose: true
            }
            );
            //添加值
            $("#main-project").val(project);
            $("#main-module").val(module);
            $("#main-function").val(func);
            $("#main-detail").val(detail);
            $("#main-people").val(people);
            $("#main-datetimepicker").val(dtateline);
            //重置
            $("#modify-btn-reset").on('click', function() {  //增、改

                $("#main-project").val("");
                $("#main-module").val("");
                $("#main-function").val("");
                $("#main-detail").val("");
                $("#main-people").val("");
                $("#main-datetimepicker").val("");

            });
            //修改
            $("#modify-btn-modifyschedule").on('click', function() {  //增、改

                project_modified = $("#main-project").val();
                module_modified = $("#main-module").val();
                func_modified = $("#main-function").val();
                detail_modified = $("#main-detail").val();
                people_modified = $("#main-people").val();
                dateline_modified = $("#main-datetimepicker").val();
                $.ajax({
                    type: "post",
                    url: "/testdrive/index.php/schedule/modifyschedule",
                    data: {"sid": id,
                        "project": project_modified,
                        "module": module_modified,
                        "func": func_modified,
                        "detail": detail_modified,
                        "people": people_modified,
                        "dateline": dateline_modified},
                    success: function(result) {
                        //  alert(result);
                        mewdata = JSON.parse(result);
                        //    ;
                        //      alert(mewdata);
                        $('#main-addschedule-Modal').modal('hide');
                        $('#main-show-modal').modal({
                            keyboard: false
                        });
                        $("#main-show-modal-body-context").html("修改成功！");
                        // trid = "\"#" + id + "\"";
                        //  alert( mewdata.sid);
                        newdetailbutton = "<input type=" + "\"button\"" + " onclick=" + "\"detailButton('" + mewdata.sid + "','" + mewdata.detail + "')\"" + " value=" + "\"详情\"" + ">";//添加按钮
                        //    alert(newdetailbutton);              
                        newmodifybutton = "<input type=" + "\"button\"" + " onclick=" + "\"modifyButton('" + mewdata.sid + "','" + mewdata.project + "','" + mewdata.module + "','" + mewdata.func + "','" + mewdata.detail + "','" + mewdata.people + "','" + mewdata.dateline + "')\"" + " value=" + "\"修改\"" + ">";
                        //  alert(newmodifybutton);    
                        // newschtable = "<tr id=" + mewdata.sid + ">" + "<td>" + mewdata.dateline + "</td>" + "<td>" + mewdata.project + "</td>" + "<td>" + mewdata.module + "</td>" + "<td>" + mewdata.func + "</td>" + "<td>" + mewdata.people + "</td>" + "<td>" + mewdata.adder + "</td>" + "<td>" + mewdata.addtime + "</td>" + "<td>" + detailbutton + "</td>" + "<td>" + modifybutton + "</td>" + "</tr>";
                        newschtable = "<td>" + mewdata.dateline + "</td>" + "<td>" + mewdata.project + "</td>" + "<td>" + mewdata.module + "</td>" + "<td>" + mewdata.func + "</td>" + "<td>" + mewdata.people + "</td>" + "<td>" + mewdata.adder + "</td>" + "<td>" + mewdata.addtime + "</td>" + "<td>" + newdetailbutton + "</td>" + "<td>" + newmodifybutton + "</td>";
                        // newschtable ="<tr id=" + mewdata.sid + ">" +  "<td>" + mewdata.dateline + "</td>" + "<td>" + mewdata.project + "</td>" + "<td>" + mewdata.module + "</td>" + "<td>" + mewdata.func + "</td>" + "<td>" + mewdata.people + "</td>" + "<td>" + mewdata.adder + "</td>" + "<td>" + mewdata.addtime + "</td>" + "<td>" + newdetailbutton + "</td>" + "<td>" + newmodifybutton + "</td>" + "</tr>";

                        // alert(newschtable);
                        // $('#schedule-table').append(newschtable);
                        //$("#main-show-modal-body-context").html(newschtable);
                        //  $("\"#" + id + "\"").html("");
                        //  
                        //  //！！！！！！！！！！错误原因：只要正常使用id就行，不需要转义


                        $("#" + id).html(newschtable);
                    },
                    error: function() {
                        alert("修改失败！再尝试一下....");
                    }
                }
                );



            });


        }

        $(function() {

            getscheduledetails();//创建添加排期的页面



            $(document).on('click', '#schedule-table button', function(e) {  //查

                var $target = $(e.target);
                $('#sheet-list li').each(function() {
                    $(this).removeClass('active');
                });
                $target.parent().addClass('active');

                $("#function-module-name").html($target.html());
            });

            $(document).on('click', '#sheet-list li', function(e) {  //查

                var $target = $(e.target);
                $('#sheet-list li').each(function() {
                    $(this).removeClass('active');
                });
                $target.parent().addClass('active');

                $("#function-module-name").html($target.html());
            });

            $("#btn-save").on('click', function() {  //增、改
                // currentSheetContent = handsontable.getData();
                project = $("#project").val();

                module = $("#module").val();
                func = $("#function").val();
                detail = $("#detail").val();
                people = $("#people").val();
                dateline = $("#time").val();
                //            alert(time);
                //            alert(project+module+func+detail+people+time);
                $.ajax({
                    type: "post",
                    url: "/testdrive/index.php/schedule/addschedule",
                    data: {"project": project,
                        "module": module,
                        "func": func,
                        "detail": detail,
                        "people": people,
                        "dateline": dateline},
                    success: function(result) {
                        //  alert(result);
                        alert(JSON.stringify(result));
                        if (result != null) {
                            //   alert(result.toString()+"恭喜，保存成功！");
                            alert(result.toJSONString());

                        } else {
                            alert("不好意思，失败喽....");
                        }
                        //    var results = JSON.parse(result);


                    },
                    error: function() {
                        alert("保存失败！再尝试一下....");
                    }
                }
                );

            });


        });


    </script>
